import React, { FC, useState } from 'react';
import { Upload } from 'choerodon-ui/pro';
import { UploadProps } from 'choerodon-ui/pro/lib/upload/Upload';
import { UploadFile } from 'choerodon-ui/pro/lib/upload/interface';

export interface UploadPictureStyleProps {}

const UploadPictureStyle: FC<UploadPictureStyleProps> = () => {
  const [uploadList, setUploadList] = useState<UploadFile[]>([]);
  const uploadProps: UploadProps = {
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
    action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
    multiple: true,
    accept: ['image/*'],
    uploadImmediately: false,
    beforeUpload: (file: UploadFile) => {
      if (file.type.match('image/')) {
        setUploadList(list => [...list, file]);
      }
      // 返回false，取消默认的添加列表的行为
      return false;
    },
    uploadFileList: uploadList,
    showUploadList: true,
    previewImageWidth: 200,
  };
  return <Upload {...uploadProps} />;
};

export default UploadPictureStyle;
